// 引用组件
import loading from '@/components/loading/loading.vue';
import shoppingCart from '@/components/shopping-cart/shopping-cart.vue';
import singleSelect from '@/components/single-select/single-select.vue';
import menuHeader from './components/menu-header/menu-header.vue';
import menuClassify from './components/menu-classify/menu-classify.vue';
import menuGoods from './components/menu-goods/menu-goods.vue';

// 引用方法
import {
	request,
	throttle
} from '@/common/js/util.js';

import {
	getDistance,
	isOpening
} from '@/common/js/poinInPolygon.js'; // 处理门店信息

import InitMenuData from '@/common/js/InitMenuData.js'; // 初始化门店信息

// 输出
export default {
	components: {
		loading,
		shoppingCart,
		singleSelect,
		menuHeader,
		menuClassify,
		menuGoods
	},
	data() {
		return {
			bannerList: [], // 菜单banner图
			classifyType: "classify0", // 分类type
			classifyIdx: 0, // 分类索引
			classifyFlag: true, // 分类加锁标识
			classifyScrollTop: 0, // 分类滚动距顶高度
			classifyList: [], // 分类列表
			goodsList: [], // 商品列表
			viewHeights: [], // 视图高度数组, 用于做滚动效果
			deliveryPlace: '请选择收货地址', // 配送地点
			jumpFlag: false, // 跳转标识 如果跳转选页面没选门店或地址，则退出首页
			menuCouponNum: 0, // 菜单产品券数量
			expiringNum: 0, // 产品券快过期数量
		}
	},
	computed: {
		// 就餐方式
		diningMode() {
			return this.$store.state.diningMode;
		},
		// 当前门店信息
		currentStoreInfo() {
			return this.$store.state.currentStoreInfo;
		},
		// 配送地址
		deliveryAddress() {
			return this.$store.state.deliveryAddress;
		}
	},
	watch: {
		// 监听分类索引值的改变，并给距离重新赋值
		classifyIdx(val) {
			this.classifyScrollTop = val * 80;
		},
	},
	async onLoad(option) {
		/**
		 * 初次进来判断是否选取过门店
		 * 如果有门店 && 是自取场景 就直接加载数据 并 显示
		 * 或者 通过场景去获取门店信息 --> 见文档
		 * */
		const currentStoreInfo = this.currentStoreInfo;
		if (currentStoreInfo.id && this.diningMode === 'wx_zq') {
			this.getMenuData(currentStoreInfo); // 初始化数据，显示页面内容
		} else {
			this.getStoreInfoByScene(); // 通过场景获取门店
		}
	},
	onShow() {
		/**
		 * 判断跳转标识
		 * 菜单页跳转到选门店页面
		 * 如果用户并没有选取门店，而是点击了返回
		 * 但是返回的是菜单页，可加载数据又需要门店信息，所以就需要重定向至首页
		 * */
		if (this.jumpFlag && !this.currentStoreInfo.id) {
			uni.switchTab({
				url: '/pages/index/index'
			})
			return;
		}
		
		/**
		 * 如果有返回菜单页标识，则重新加载整个页面
		 * 作用：为了更新数据
		 * 注意：不要忘了移除标识
		 * */
		if (uni.getStorageSync('isReturnMenu')) {
			uni.removeStorageSync('isReturnMenu');
			uni.redirectTo({
				url: '/pages/menu/menu'
			});
			return;
		}

		// 每次进来都执行处理购物车数据的方法(为了同步信息)  && 剔除掉加价购的产品
		let {
			cartList
		} = this.$store.state;

		if (cartList.length) {
			cartList = cartList.filter(item => item.isRelasionSale !== '2'); // 剔除加价购产品
			this.$store.commit('handleCartList', cartList);
		}

	},
	onHide() {
		
	},
	methods: {
		// 根据场景获取门店信息
		async getStoreInfoByScene() {
			const diningMode = this.diningMode;
			if (diningMode === 'wx_zq') { // 自取场景
				
				// 获取地理位置
				/*
				const loc = await this.getLocation().then(res => {
					return res;
				}).catch(err => {
					return null;
				});
				*/
				
				const loc = null; // 由于在PC上不能获取位置，这儿默认失败

				let allStoreList = await this.getAllStoreList(); // 获取所有门店
				
				/**
				 * 如果获取了地理位置，则根据定位排序选择最近的一家在营业中的门店
				 * 如果没有获取到位置，则跳转选门店页面。
				 * 注：如果获取所有门店为空，则不做操作，提示门店获取失败 (偶发情况)
				 * */
				if (loc) { 
					
					this.$store.commit('handleTargetPoint', loc); // 缓存位置定位点
					allStoreList = this.addDistanceOpeing(allStoreList, loc); // 给门店每项添加距离和营业状态
					allStoreList.sort((x, y) => x.distance - y.distance); // 根据距离远近从小到大排序
					
					if (allStoreList.length) {
						const currentStoreInfo = allStoreList[0]; // 获取最近的一家门店
						this.$store.commit('cacheCurrentStoreInfo', currentStoreInfo); // 缓存当前门店信息
					
						this.getMenuData(currentStoreInfo); // 初始化数据，显示页面内容
					} else {
						uni.showToast({
							title: '门店获取失败',
							icon: 'none'
						})
						return;
					}

				} else {

					if (allStoreList.length) {
						// 关闭当前页跳转到门店页，并带一个返回门店的标识
						uni.redirectTo({
							url: '/pages/store/store?returnMenu=true',
						})
						
					} else {
						uni.showToast({
							title: '门店获取失败',
							icon: 'none',
						})
						return;
					}
				}

			} else { // 外卖场景
			
				const deliveryAddress = this.$store.state.deliveryAddress; // 配送地址
				const nearbyStoreIds = deliveryAddress.nearbyStore; // 附近的门店id数组
				
				/**
				 * 如果选择的地址在附近有门店
				 * nearbyStore 是数组
				 * */
				if (nearbyStoreIds) {
					
					/**
					 * 如果当前门店不在附近门店范围内 && 不是测试店 (非测试人员已过滤测试店)  
					 * 则 重新获取门店信息并缓存值
					 * 
					 * 否则直接显示页面
					 * */
					const curShopID = this.currentStoreInfo.shopID;
					const curDebug = this.currentStoreInfo.debug; // 0普通门店  1测试门店

					if (!nearbyStoreIds.includes(curShopID) && curDebug !== '1') {
						const nearbyStoreInfo = await this.getStoreInfoById(nearbyStoreIds[0]); // 查找第一个配送的门店
						this.$store.commit('cacheCurrentStoreInfo', nearbyStoreInfo); // 缓存新的门店信息
						
						this.getMenuData(nearbyStoreInfo); // 初始化数据，显示页面内容
						
					} else {
	
						this.getMenuData(this.currentStoreInfo); // 初始化数据，显示页面内容
						
					}

					this.deliveryPlace = deliveryAddress.building; // 配送地

				} else {
					uni.showToast({
						title: '前往选择地址页面',
						icon: 'none',
						duration: 5000
					})
				}
			}

			setTimeout(() => {
				this.jumpFlag = true; // 跳转标识
			}, 300);

		},

		// 授权获取地理位置
		getLocation() {
			return new Promise((resolve, reject) => {
				uni.getLocation({
					type: 'wgs84', // wgs84:GPS定位 , gcj02:国测局坐标
					success(res) {
						resolve({
							x: res.latitude,
							y: res.longitude
						});
					},
					fail(err) {
						reject(err.errMsg);
					}
				});
			})
		},

		// 获取门店信息通过门店id
		async getStoreInfoById(shopId) {
			const params = {
				shopId
			};
			const result = await request(this.$API.queryStoreInfo, params).then(res => {
				return res;
			}).catch(err => {
				return null;
			});

			return result;
		},

		// 获取所有门店
		async getAllStoreList() {
			// 已经获取过所有门店，直接取缓存数据，不用再查接口
			if (this.allStoreList && this.allStoreList.length) {
				return this.allStoreList;
			}
			
			// 发送获取门店请求 等待返回门店列表
			let allStoreList = await request(this.$API.queryAllShop, {}).then(res => {
				return res || [];
			}).catch(err => {
				return [];
			});

			allStoreList = allStoreList.filter(item => item.originalBusinessState === '2'); // 只显示营业状态的门店

			// 是否显示测试门店
			const showTestShop = 1 || 0; // 0不显示，1显示 (根据登录信息判断，这儿演示就显示测试店)

			// 筛选测试门店
			if (allStoreList.length) {
				if (showTestShop) {
					allStoreList = allStoreList.filter(x => x.name.indexOf('乐凯撒') === -1);
				} else {
					allStoreList = allStoreList.filter(x => (x.name.indexOf('乐凯撒') === -1 && x.debug !== '1'));
				}
			}

			// 缓存所有门店
			this.$store.commit("cacheAllStoreList", allStoreList);

			return allStoreList;
		},

		// 添加定位距门店距离，营业状态字段和营业时间文本
		addDistanceOpeing(storeList, targetPoint) {
			if (storeList && storeList.length) {
				storeList.map(item => {
					const geolocation = item.geolocation;
					const businessHours = item.businessHours;
					let businessHoursText = "";
					item.distance = getDistance(targetPoint.x, targetPoint.y, geolocation.latitude, geolocation.longitude);
					item.openingCategory = isOpening(businessHours);
					businessHours.length && businessHours.map(item => {
						businessHoursText += ` , ${item.from}~${item.to}`;
					})
					businessHoursText = businessHoursText ? businessHoursText.slice(3) : '';
					item.businessHoursText = businessHoursText;
					item.detailAddress = item.city + item.district + item.address;
				})
				return storeList;
			} else {
				return [];
			}
		},
		
		// 获取菜单数据 并 初始化数据
		async getMenuData(storeInfo) {
			const IMT = new InitMenuData(storeInfo);
			await IMT.init();
			const {originProducts, bannerList} = IMT.output();
			this.initMenu(originProducts);
		},

		// 初始化菜单
		initMenu(result) {
			const goodsList = result.filter(item => item.col_type === '0'); // 产品列表
			const classifyList = []; //分类列表

			goodsList.length && goodsList.map((item, index) => {
				classifyList.push({
					id: 'classify' + index,
					name: item.name,
					col_font_new: item.col_font_new
				});
			});

			this.goodsList = goodsList;
			this.classifyList = classifyList;
			
			// 隐藏加载遮罩层
			// #ifdef H5
			this.$refs.myLoading.hideLoading(); 
			// #endif
			
			// #ifndef H5
			this.selectComponent("#myLoading").hideLoading();
			// #endif
			
		},
		
		// 获取视图高度数组
		getViewHeights(list) {
			this.viewHeights = list;
		},

		// 点击分类
		onClassify(data) {
			const {val, idx} = data;
			
			this.classifyFlag = true;
			this.classifyType = val;
			this.classifyIdx = idx;
		},

		//商品区域滚动事件（节流函数处理，提升性能)
		onGoodsScroll(e) {
			// 因 scroll-into-view 引起的滚动操作同样会触发scroll事件。加锁定状态处理
			if (this.classifyFlag) {
				this.classifyFlag = false;
				return;
			}

			const {
				scrollTop
			} = e.detail;

			const viewHeights = this.viewHeights;

			let showCategoryIndex = 0;
			let curHeight = 0;
			for (let i = 0; i < viewHeights.length; i++) {
				curHeight += this.viewHeights[i];
				if (scrollTop < curHeight) break;
				if (showCategoryIndex < this.viewHeights.length - 1) showCategoryIndex++;
			}

			this.classifyIdx = showCategoryIndex;

		},

		// 去订单确认页面
		goConfirmPage() {
			uni.showToast({
				title: '前往订单确认页',
				icon: 'none',
				duration: 5000
			})
		}
	}
}
